今天這篇算是滿久以前整理的文章，因為家族行程的關係，就先讓我預支一篇吧XD

若是使用Webpack起手Angular2專案，大概要加減知道這些polyfill

但是現在幾乎都用Angular-cli了，這些都被cli做掉了。

不過多多了解總是好的：）

初看Angular2 Quickstart時，

不太能理解為什麼要引入一些第三方的Lib，而這些Lib到底作用是什麼？

在FB的Angular社團詢問後，得到一些解答。

昨天找到一篇文章Angular 2 Dependencies: Features from the Future

有特別說明到這些Lib的用處，最主要的是提供對未來ES6/7的規格特性的支援

因為目前的Browser大部分都還在ES5的實作，本身還無法實現ES6/7的語法。

通常Browser本身還沒實作的規格，我們都會用polyfill幫Browser補上特性。

先列出目前Quickstart預設要求要安裝的套件

"core-js": "^2.4.0",
"reflect-metadata": "^0.1.3",
"rxjs": "5.0.0-beta.6",
"zone.js": "^0.6.12"

接下來說明這些polyfill如下：

core-js

主要是提供es6-shim，例如像是Promise及Generator的特性。

一開始我的想法有一個盲點

Angular2已經使用TypeScript做編譯，將TS語法轉成Target ES3/5的語法

（TS如何轉成PURE JS的設定，可以參考tsconfig.json)

為什麼還需要補上es6-shim？

後來實際測試發現，如果我有用上Promise的語法，若我的target是ES5以下

TypeScript Compiler(tsc)會告訴我這個他無法幫我轉成ES5以下的語法。

class,interface,module這些語法tsc都能轉譯

只有像Promise及Generator這種ES6的專有特性，tsc無法轉譯。

因此一開始就把es6-shim掛上專案，就可以安心的使用ES6特性，不會被報錯。

reflect-metadata

主要是提供ES7提出的Decorator特性，

我們在看Angular2的程式可以看到以下用@標記的語法

@Compoent - ng2的元件寫法

@Injectable - ng2的服務寫法

@Pipe - ng2的Filter寫法

Angular2直接就使用ES7的Decorator特性。

因此這也是一定要裝才能讓Angular2正常運作。

rxjs

主要是提供ES7提出的Observables特性，

Observables提供了非同步資料fetch時的另一種做法。

我們跟伺服器端抓取完資料，要做後續的動作時，

最早的寫法是用callback，

後來改良的寫法是使用Promise減少callback hell的發生。

Promise已經很好用了，但是它還是有些缺點。

• 它無法做到發送request後，可以中止或是重送的功能。

• 它在宣告使用Promise時，就已經被執行了。

而Observables解決了Promise的這些問題，

• 它可以中止及重送request。

• Observables在創建時不會被執行，而是實際呼叫時才被執行。

另外Observables又提供了值組的操作，像是merge、sum、map等功能。

還有Observables就如同它字面的意思，他實作觀察者模式，當資料變更時會發出通知給它的訂閱者。

官方的Angular2教學文件在非同步資料抓取，是直上ES7的規格，提供Observables的寫法，但你也可以依據你的專案需求改成Promise。

一般的專案，也許可以用Promise就能滿足了，但是如果你的專案功能是需要比較互動、即時性的時候，用上Observables就不用費太多功夫做資料的watch。

TODO:再多深入了解Observables

zone.js

在Angular 1以前，如果變更是發生在digest cycle外的，我們必需要使用$scope.$apply用以明確的通知變更。但是現在透過zone，就不需要再多做$scope.$apply，Angular2不需要通知就會自動做資料變更的檢測。

結論

因此Angular2的框架是完全的兼容未來的Feature，這些Feature在開發大型且複雜的應用程式，都佔有舉足輕重的角色。

另外，我覺得在學習Angular2的框架的過程中，會了解到它有很多部分納入了Design Pattern。過去的前端程式，想要應用Design Pattern實作出有彈性能擁抱變化的程式，且讓專案的成員都能知道程式架構的設計理念，是相當困難的。可是因為Angular2本身納入了一些Design Pattern，專案的成員只要好好的照著框架提供的寫法，就能夠做出程式結構品質不會太差的程式碼，這也是為什麼很多人會覺得Angular2是非常適用於接專案類型的公司。